@charset "utf-8";
/* CSS Document */
@import url('../Fonts/UTMTrajan/font.css');
@import url('../Fonts/VLGlober/font.css');
/*@import url('../Fonts/Weather/font.css');*/
@import url('font-awesome.min.css');

/* CSS Reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	outline: 0 none;
	margin: 0 auto;
    padding: 0;
    border: 0 none;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
a{
	text-decoration:none;
    cursor: pointer;
}
a:hover{
	text-decoration:none;
}
/*body, input, textarea, select, button {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -moz-font-feature-settings: "liga", "kern";
}
html {
    font-size:100%;
    -ms-text-size-adjust:100%;
    -webkit-text-size-adjust:100%;
	overflow:hidden;
}*/
body
{
	margin:0px auto;
	font: 12px/18px "vl_globersemibold_free",'Arial';
    background: #fff;
	background-size:cover;
	color:#333;
	-webkit-font-smoothing: subpixel-antialiased;
	-ms-font-smoothing: subpixel-antialiased;
	font-weight: 400;
	position:relative;
	width:100%;
	height:100%;
	/*overflow:hidden;*/
}
body:after{
    display:none;
	background:url(../Images/Fullscreen_Off.png)
	,url(../Images/Sound.png);
}
/*-----------------------Header------------------*/
.header_bg{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:76px;
	/*background:rgba(0,174,197,0.8);
	border-bottom: 3px solid rgba(189,130,50,0.6);*/
	z-index:11;
	opacity:0;
}
.header_bar{
	position:absolute;
	width:100%;
	height:38px;
	background:#fff;
	z-index:10;
}
.header_line{
	position:absolute;
	width:100%;
	height:5px;
	top:38px;
	background:#0068AC;
	z-index:9;
}
.logo_bg 
{
	position:absolute;
	z-index:11;
    float: left;
    width: 135px;
    height: 222px;
    background: url(../Images/logo_bg.png) right no-repeat;
	background-size:cover;
}
.logo {
    float: left;
    width: 128px;
    height: 128px;
	background: url(../Images/logo.png) right no-repeat;
	background-size:cover;
    /*margin: 9px 0 0 35px;*/
}
.home_btn{
	float:left;
	width:38px;
	height:38px;
	text-align:center;
	color:#0068AC;
	font-size:20px;
	padding-top:10px;
	margin-left:168px;	
}
.home_btn:hover{
	color:#FAC01F;
}
.lang_menu_bg{
    position: absolute;
    right: 0;
    top: 0;
    width: 108px;
    height: 38px;
    background: #0068AC;
    z-index: 99;
}
.lang_menu_select {
    color: #fff;
    text-transform: uppercase;
    cursor: pointer;
}
.lang_menu_select span{
    float: left;
    color: #fff;
    font-size: 12px;
    margin: 12px 0 0 16px;
}
.lang_menu_select i{
    float: right;
    color: #fff;
    font-size: 12px;
    margin: 15px 15px 0 0;
    -webkit-transition: all 260ms linear;
    -moz-transition: all 260ms linear;
    -o-transition: all 260ms linear;
    -ms-transition: all 260ms linear;
    transition: all 260ms linear;
}
.lang_menu_bg:hover .lang_menu_select i{
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.lang_menu {
    position: absolute;
    width: 108px;
    left: 0;
    top: 43px;
    background: #0068AC;
    overflow: hidden;
    height: 0;
    -webkit-transition: all 260ms linear;
    -moz-transition: all 260ms linear;
    -o-transition: all 260ms linear;
    -ms-transition: all 260ms linear;
    transition: all 260ms linear;
}
.lang_menu_bg:hover .lang_menu{
    height: 76px;
}
.lang_menu_bg a{	
	float:left;
    width: 100%;
    height: 38px;
    line-height: 38px;
    font-size: 13px;
    color: #fff;
    padding-left: 15px;
	-webkit-transition: all 160ms linear;
    -moz-transition: all 160ms linear;
    -o-transition: all 160ms linear;
    -ms-transition: all 160ms linear;
    transition: all 160ms linear;
    border-top:1px solid rgba(255,255,255,0.1);
}
.lang_menu_bg a:hover{
	background:#FAC01F;
}
.lang_menu_bg a.selected,
.lang_menu_bg a:active{	
	background:#FAC01F;    
	/*filter: brightness(88%);
    -webkit-filter: brightness(88%);
    -moz-filter: brightness(88%);
    -o-filter: brightness(88%);
    -ms-filter: brightness(88%);*/
}
/*-----------------------Footer------------------*/
.footer_bg{
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	height:56px;
	z-index:11;
	opacity:0;
}
.footer_line{
	position:absolute;
	width:100%;
	height:5px;
	bottom:0px;
	/*background:rgba(0,174,197,0.8);*/
	background:#fff;
	z-index:9;
}
.title_bg{
	position:absolute;
	bottom:5px;
	right:0;
	min-width:150px;
	height:42px;
	background:url(../Images/title_bg.png) left bottom;	
	z-index:11;
}
.pano_title{
	font-size:13px;
	text-transform: uppercase;
    font-family: 'utm_trajan_pro_boldregular';
    text-align: center;
	color:#0068AC;
	line-height:48px;
	padding:0 26px 0 62px;
}
.megapixel{
	position:absolute;
	width:50px;
	height:11px;
	bottom:56px;
	right:6px;	
}
.megapixel img{
	width:100%;
	height:auto;	
}
.footer_control_bg{
	position:absolute;
	left:6px;	
	bottom:11px;
	width:38px;
}
.control_btn{
	float:left;
	width:38px;
	height:38px;	
	margin-top:6px;
	background-color:rgba(0,104,172,0.8);	
}
.control_btn:hover{
	background-color:rgba(250,192,31,0.8);	
}
.control_btn.sound{
	background-image: url(../Images/Sound_Mute.png);
	background-size:contain;
}
.control_btn.sound.active{
	background-image:url(../Images/Sound.png);
	background-size:contain;
}
.control_btn.autotour{
	background-image: url(../Images/Auto_Rotate.png);
	background-size:contain;
}
.control_btn.autotour.active{
	background-image: url(../Images/Auto_Rotate_Off.png);
	background-size:contain;
}
.control_btn.vr{
	background-image:url(../Images/VRButton.png);
	background-size:contain;
}
.control_btn.location{
	background-image:url(../Images/Location.png);
	background-size:contain;
}
.control_btn.info{
	background-image:url(../Images/infomation.png);
	background-size:contain;
}
.control_btn.fullscreen{
	background-image:url(../Images/Fullscreen.png);
	background-size:contain;
}
.control_btn.fullscreen.active{
	background-image:url(../Images/Fullscreen_Off.png);
	background-size:contain;
}
.control_btn.help{
	background-image:url(../Images/Help.png);
	background-size:contain;
}
.backgroudMusic{
	height:0 !important;
	width:0 !important;
	display:none;
	overflow:hidden;	
}
.control_btn.share{
	position:relative;
	float:left;
	background-image:url(../Images/Share.png);
	background-size:contain;
}
.sharethis_bg{
	position:absolute;
	top:0;
	left:46px;
	width:0;
	height:158px;
	overflow:hidden;
	background:rgba(0,104,172,0.8);
	-webkit-transition: all 260ms linear;
    -moz-transition: all 260ms linear;
    -o-transition: all 260ms linear;
    -ms-transition: all 260ms linear;
    transition: all 260ms linear;
	/*-webkit-transition:all 0.15s ease-in-out;
    -moz-transition:all 0.15s ease-in-out;
    -o-transition:all 0.15s ease-in-out;
    transition:all 0.15s ease-in-out;*/	
	z-index:9999; 
}
.sharethis{
	margin:9px 0 0 6px;
}
.control_btn.share:hover .sharethis_bg{
	width:50px;
}
/*-------------------------Autotour----------------------*/
.autotour_control{
	display:none;
	z-index:11;	
}
.autotour_control.logo{
	position:absolute;
	width:128px;
	height:128px;
	background:url(../Images/Logo.png) no-repeat;
	top:-5px;
	left:-10px;
	margin:0;	
	background-size:cover;	
}
.autotour_control.exit_fullscreen{
	position:absolute;
	width:36px;
	height:36px;
	top:3px;
	right:3px;
	background:url(../Images/exit_fullscreen.png) center no-repeat;
}
/*.autotour_control.pano_title{
	position:absolute !important;
	bottom:0;
	left:0;
	padding:16px 18px 15px 18px;
	margin:0;
	color:#1E2960;
	text-transform:uppercase;
	text-shadow: 0 0 1px rgba(30,41,96,0.38);
	font-size:18px;
	background:rgba(255,255,255,0.38);
}*/
/*-------------------------Tooltip----------------------*/
.pano_tooltip{
	position: absolute;
    z-index: 9999 !important;
	background:rgba(0,104,172,0.68) !important;
	color:#fff;
	padding:3px 8px 5px 8px !important;
	border-radius:0;
	border:none;
	margin-right:20px!important;
	font: 13px "vl_globersemibold_free",'Arial'  !important;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.ui-tooltip {
	padding:8px;
	position:absolute;
	z-index:100;
	-o-box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
	box-shadow: none;
}
/*---------------------Máy tính bàn-----------------------------*/
@media only screen and (min-width : 1200px){
/*.menu_item_bg:hover .menu_item span{
	bottom:-3px;
	opacity:1;
}*/
}
/*---------------------Máy tính bảng ngang-----------------------------*/
/*@media only screen and (min-width : 960px) and (max-width : 1199px){*/
@media only screen and (min-width : 992px) and (max-width : 1200px)
{
/*nav .menu_item 
{
	margin: 0 0 0 18px;
	font-size: 12px;      
	padding:11px 0 0 0;	
}
.sub_menu_bg.last{
	right:0;	
}
.lang_menu_bg{
	margin: 12px 12px 0 0;
}*/
}
/*---------------------Máy tính bảng dọc--------------------------------*/
/*@media only screen and (min-width : 768px) and (max-width : 959px){*/
@media only screen and (min-width : 768px) and (max-width : 992px)
{
.lang_menu_bg{
	position:absolute;
	right:48px;
}
.home_btn{
	margin-left:148px;	
}
.menu_btn{
	float:right;
	margin-right:200px;
	width:40px;
	height:36px;
	margin:2px 3px 0 0;
	background:none;
}
.menu_bg{
	position:absolute;
	top:43px;
	right:-50%;	
	opacity:0;
	width:50%;
	background:#fff;
	min-height:100%;
	z-index:9;
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.menu_item_bg{	
	float:left;
	width:100%;
}
.menu_item{
	float:left;
	width:100%;
	height:40px;
	line-height:39px;
	margin:0 !important;
	padding:0 0 0 16px !important;
	background:#0068AC;
	color:#fff !important;
	text-transform:uppercase;
	font-size:12px;
	border-bottom:1px solid rgba(255,255,255,0.36);	
}
.menu_item i::before{
	visibility:visible;
	float:right;
	font-family:'FontAwesome';	
	content:'\f196';
	margin-right:12px;
	font-size:11px;
	color:rgba(255,255,255,0.98);	
}
.menu_item_bg.active .menu_item{
	background:#005995;
	color:#fff;
}
.menu_item_bg.active .menu_item i::before{	
	content:'\f147';
	color:#fff;	
} 
.menu_item span{
	display:none;
}
/*.sub_menu_mobile_bg{
	float:left;
	width:100%;
	display:none;	
}
.sub_menu_box{
	float:left;
	width:100%;
	margin:0 0 2px 0;
}*/
.sub_menu_item{
	float:left;
	width:100%;
	height:36px;
	padding:0 0 0 20px;
	line-height:34px;
	font-size:12px;
	color:#333;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	border-top:1px solid rgba(102,102,102,0.1);
	margin:0 !important;
}
.sub_menu_item img{
	display:none;
}
.sub_menu_item div{  
	position:relative; 
	text-align:left;
	padding-top:0;
}
.sub_menu_item:first-child{
	border-top:1px solid rgba(102,102,102,0);
}
.sub_menu_item div::before{
	font-family:'FontAwesome';
	margin-right:15px;
	content:'\f0da'
}
/*.sub_menu_item div::after{
	position:absolute;
	right:0;
	content: " ";
	width:5px;
	height:36px;
	background:#FAC01F;
}*/
.sub_menu_item:hover,
.sub_menu_item.active {
	/*background:#FAC01F;
	color:#333;*/
	background:#fff;
	color:#333;
}
.sub_menu_item.active div::after{
	position:absolute;
	left:-20px;
	top:-1px;
	content: "";
	width:6px;
	height:36px;
	background:#FAC01F;
}
/*.control_bar{
	width:248px;
}
.title_bg{
	right:208px;
}*/
}
/*----------------------Điện thoại di động-------------------------------*/
/*@media only screen and (max-width : 767px)	{*/
@media only screen and (max-width : 767px)	{
/*.header_bar{
	height:48px;
}*/
.logo_bg 
{
    /*width: 108px;
    height: 48px;*/
	height: 43px;
	background:none;
}
.logo {
    width: 111px;
    height: 28px;
	background:url(../Images/logo_m.png) no-repeat;
	background-size:contain;
    margin: 5px 0 0 6px;
}
/*.header_line{
	top:48px;
}*/
.lang_menu_bg{
	position:absolute;
	right:48px;
}
.home_btn{
	margin-left:142px;	
}
.menu_btn{
	float:right;
	margin-right:200px;
	width:40px;
	height:36px;
	margin:2px 3px 0 0;
	background:none;
}
.menu_bg{
	position:absolute;
	top:43px;
	right:-100%;	
	opacity:0;
	width:100%;
	background:#fff;
	min-height:100%;
	z-index:9;
	-webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.menu_item_bg{	
	float:left;
	width:100%;
}
.menu_item{
	float:left;
	width:100%;
	height:40px;
	line-height:39px;
	margin:0 !important;
	padding:0 0 0 16px !important;
	background:#0068AC;
	color:#fff !important;
	text-transform:uppercase;
	font-size:12px;
	border-bottom:1px solid rgba(255,255,255,0.36);	
}
.menu_item i::before{
	visibility:visible;
	float:right;
	font-family:'FontAwesome';	
	content:'\f196';
	margin-right:12px;
	font-size:11px;
	color:rgba(255,255,255,0.98);	
}
.menu_item_bg.active .menu_item{
	background:#005995;
	color:#fff;
}
.menu_item_bg.active .menu_item i::before{	
	content:'\f147';
	color:#fff;	
} 
.menu_item span{
	display:none;
}
/*.sub_menu_mobile_bg{
	float:left;
	width:100%;
	display:none;	
}
.sub_menu_box{
	float:left;
	width:100%;
	margin:0 0 2px 0;
}*/
.sub_menu_item{
	float:left;
	width:100%;
	height:36px;
	padding:0 0 0 20px;
	line-height:34px;
	font-size:12px;
	color:#333;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	border-top:1px solid rgba(102,102,102,0.1);
	margin:0 !important;
}
.sub_menu_item img{
	display:none;
}
.sub_menu_item div{  
	position:relative; 
	text-align:left;
	padding-top:0;
}
.sub_menu_item:first-child{
	border-top:1px solid rgba(102,102,102,0);
}
.sub_menu_item div::before{
	font-family:'FontAwesome';
	margin-right:15px;
	content:'\f0da'
}
/*.sub_menu_item div::after{
	position:absolute;
	right:0;
	content: " ";
	width:5px;
	height:36px;
	background:#FAC01F;
}*/
.sub_menu_item:hover,
.sub_menu_item.active {
	/*background:#FAC01F;
	color:#333;*/
	background:#fff;
	color:#333;
}
.sub_menu_item.active div::after{
	position:absolute;
	left:-20px;
	top:-1px;
	content: "";
	width:6px;
	height:36px;
	background:#FAC01F;
}
.footer_bg{
	height:36px;
	background:#000000;
	overflow:visible;
}
.footer_line{
	display:none;
}
.footer_control_bg{
	width:100%;
	text-align:center;
	bottom:46px;
	left:0;
}
.control_btn{
	float:none !important;
	display:inline-block !important;
	margin:0 8px;
}
.control_btn.help,
.control_btn.share,
.control_btn.autotour{
	display:none !important;
}
.title_bg{
	bottom:0;
	right:0;
	height:42px;
	width:100%;
	background:#fff;
	border-top:5px solid #0068AC;
}
.pano_title{
	height:42px;
	font-size:12px;
	line-height:42px;
	padding:0;
	color:#0068AC;
}
}
@media only screen and (max-width : 374px)	
{
.home_btn{
	margin-left:116px;	
}
}



