html>body{overflow:hidden}

body {
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	background-color:#fff;
	font-family:arial;
	-webkit-text-size-adjust: none;
}

a {color:#666;}

img {border:0}

body[lang="en"]{font-family:'Droid Sans', 'Arial', sans-serif}

#loading{background:#0e335f no-repeat center center;z-index:99999;width:100%;height:100%;position:fixed;top:0;left:0;display:block}

#header {
	position:fixed;
	width:100%;
	height:42px;
	background-color:#ededed;
	opacity:1.5;
	filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
	z-index:1;
}

#logo {position:fixed;left:0px;top:0px;z-index:11}
#logo img1 {height:35px;margin-left:10px;margin-top:8px}
#logo img {height:52px;margin-left:0px;margin-top:0px}

nav {
	position:fixed;
	height:42px;
	z-index:3;
}

#menu a{display:inline-block;height:42px;padding-left:16px;padding-right:16px;line-height:42px;text-align:right;z-index:5;position:relative}

#menu a.on img.on {display:block}
#menu a.on img.off {display:none}
#menu a.off img.on {display:none}
#menu a.off img.off {display:block}
#menu a img.on {display:none}
#menu a img.off {display:block}


nav a.last {padding-right:16px;}
nav a img {height:21px;margin-top:10px;border:0px}


#btn_open_menu {position:fixed;float:right;z-index:3;display:none;width:70px;padding:15px;font-size:14px;}
#btn_open_menu img {height:9px}

#btn_close_menu {position:fixed;float:right;z-index:2;display:none;width:70px;padding:15px;font-size:14px;}
#btn_close_menu img {height:9px;}


#magic{position:absolute;bottom:0;left:0;width:0;height:42px;z-index:2}
#magic2{position:absolute;bottom:0;left:0;width:0;height:42px;background:#0e335f;z-index:1;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=30);opacity:0.3}

#magic2 .color {}


#container {position:absolute;width:100%;height:100%;overflow:hidden;z-index:0}
div.pane {width:100%;height:100%}

.pane{
	float:left;position:relative;width:100%;height:100%;overflow:hidden;
	-webkit-transform:translate3d(0, 0, 0);-moz-transform:translate3d(0, 0, 0);-ms-transform:translate3d(0, 0, 0);-o-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)
}

.pane .bg {position:absolute;left:0px;bottom:0px;width:100%}
.pane .bg img  {width:100%}


#about_us .txt {font-size:22pt;color:#0e335f;line-height:40pt;display:none}
#about_us strong {text-transform:uppercase;font-weight:bold;}
#mobile_txt {display:none;}

#our_business .spane {float:left;width:746px;height:514px;margin:2px;background-size:auto 100%;}
#our_business .spane .bg {position:relative;top:300px;width:746px;height:206px;background-image:url('../images/bg_black_50.png')}
#our_business .spane .txt {font-size:20pt;color:#fff;position:relative;top:10px;left:10px}
#our_business .spane .txt span.header {font-size:24pt;color:#d8d3b5;width:746px}

#system_business {background-image:url('../images/b1.jpg')}
#infra_business {background-image:url('../images/b3.jpg')}
#solution_business {background-image:url('../images/b2.jpg')}
#service_business {background-image:url('../images/b4.jpg')}


.pane {
	background-repeat:no-repeat;
	background-position:right bottom;
	background-size:100% auto;
	
	/* background size */
    -webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	-ms-background-size: 100% auto;
	-o-background-size: 100% auto;
	background-size: 100% auto; 
}

#about_us {
	background-image:url('../images/main03.jpg');
	-webkit-background-size: 100% 100%;
	-moz-background-size: 100% 100%;
	-ms-background-size: 100% 100%;
	-o-background-size: 100% 100%;
	background-size: 100% 100%;
	
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../images/main03.jpg', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../images/main03.jpg', sizingMethod='scale')";
}

#our_business {
}

#our_works {
}

#our_partners {
}

#our_office {
}

.sub_pane {position:relative;left:0px;top:0px;width:1500px;}

#our_works .btn {position:absolute;right:0px;bottom:0px;}

#our_partners .sub_pane1 {border: 1px solid #0e335f;}

#our_partners .sub_pane img {
	border: 1px solid #0e335f;margin:10px;width:350px;
}

#our_office .sub_pane div {float:left}
#our_office .office_list {
	width:45%;
}
#our_office .office {
	width:95%;
	background-image:url('../images/line_dot.png');	
	background-repeat:repeat-x;
	background-position:bottom;
	margin-right:0px;
	margin-bottom:20px;
	margin-top:0px;
	padding-bottom:10px;
}
#our_office .office div {width:100%;color:#666;font-size:14pt;}
#our_office .office .title {color:#000;font-size:26pt;text-transform:uppercase;font-weight:bold;cursor:pointer}
#our_office .subtitle {color:red}
#our_office .project_office {font-size:8pt}
#our_office .contact {position: absolute;left:0px;bottom:-20px;margin-bottom:0px;}
#our_office .contact .email {font-weight:bold}

#map_canvas {
	position:absolute;width:100%;height:100%;left:0px;top:0px;z-index:1111;
	width:100%;height:100%;
	border: 10px solid #0e335f;
}


.card {
	display:block;
	width:364px;
	height:442px;
	position:relative;
	margin:10px;
	float:left;
}

.card .card-front {
	display:block;
	width:100%;
	height:100%;
	position:absolute;
	border: 2px solid #0e335f;
	background:#fff;
	color:#a4a4a4;
	font-family:arial;
	font-weight:bold;
}

.card .card-front .top {
}

.card .card-front .title {
	padding:20px;
	color:#0e335f;
	font-size:36pt;
	text-align:bottom;
	vertical-align:bottom;
}

.card .card-front .txt {
	font-size:30pt;
	padding-left:20px;
	float:left;
}

.card .card-back {
	width:100%;
	height:100%;
	position:absolute;
	border: 2px solid #434343;
	background:#434343;
	color:#fff;
}

.card .card-back .text {
	font-family:arial;
	font-size:20pt;
	padding:10px;
	padding-top:20px;
}



.card > div.card-back,div.card-front {
	-webkit-transition:1s ease-in-out;
	-moz-transition:1s ease-in-out;
	-ms-transition:1s ease-in-out;
	transition:1s ease-in-out;
}

.card > div.card-back {
	-moz-backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	backface-visibility:hidden;
	-moz-transform:perspective(800px) rotateY(180deg);
	-webkit-transform:perspective(800px) rotateY(180deg);
	-ms-transform:perspective(800px) rotateY(180deg);
	transform:perspective(800px) rotateY(180deg);
}

.card > div.card-front {
	-moz-backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	backface-visibility:hidden;
	-moz-transform:perspective(800px) rotateY(0deg);
	-webkit-transform:perspective(800px) rotateY(0deg);
	-ms-transform:perspective(800px) rotateY(0deg);
	transform:perspective(800px) rotateY(0deg);
}

.card:hover > div.card-back {
	-moz-transform:perspective(800px) rotateY(0);
	-webkit-transform:perspective(800px) rotateY(0);
	-ms-transform:perspective(800px) rotateY(0);
	transform:perspective(800px) rotateY(0);
}

.card:hover > div.card-front {
	-webkit-transform:perspective(800px) rotateY(-179.9deg);
	-moz-transform:perspective(800px) rotateY(-179.9deg);
	-ms-transform:perspective(800px) rotateY(-179.9deg);
	transform:perspective(800px) rotateY(-179.9deg);
}

#ie6 {
	position:absolute;left:0px;top:0px;z-index:1111;width:100%;height:100%;background:white;display:none;
}

#ie6 .header{
	text-align: center;
	font-family: wf_SegoeUILight, "Segoe UI Light", "Segoe Light", "Segoe WP Light", Tahoma, Verdana, Arial, sans-serif;
	font-size: 3em;
	color: rgb(127, 186, 0);
	letter-spacing: normal;
}

#ie6 .header2 {
	text-align: center;
	font-family: wf_SegoeUILight, "Segoe UI Light", "Segoe Light", "Segoe WP Light", Tahoma, Verdana, Arial, sans-serif;
	font-size: 2em;
	letter-spacing: normal;
}

#ie6 .txt {
	text-align: center;
	font-family: wf_SegoeUILight, "Segoe UI Light", "Segoe Light", "Segoe WP Light", Tahoma, Verdana, Arial, sans-serif;
	font-size: 1em;
	letter-spacing: normal;
}


#vertical_smartphone {
	position:absolute;left:0px;top:0px;z-index:1111;width:100%;height:100%;background:white;display:none;
}

#vertical_smartphone .header{
	text-align: center;
	font-family: wf_SegoeUILight, "Segoe UI Light", "Segoe Light", "Segoe WP Light", Tahoma, Verdana, Arial, sans-serif;
	font-size: 3em;
	color: rgb(127, 186, 0);
	letter-spacing: normal;
}

#vertical_smartphone .header2 {
	text-align: center;
	font-family: wf_SegoeUILight, "Segoe UI Light", "Segoe Light", "Segoe WP Light", Tahoma, Verdana, Arial, sans-serif;
	font-size: 2em;
	letter-spacing: normal;
}

#vertical_smartphone .txt {
	text-align: center;
	font-family: wf_SegoeUILight, "Segoe UI Light", "Segoe Light", "Segoe WP Light", Tahoma, Verdana, Arial, sans-serif;
	font-size: 1em;
	letter-spacing: normal;
}

#menu a.on {background:#0e335f;}

#mobile_popup {position:fixed;left:0px;top:0px;border: 5px solid #0e335f;background:white;z-index:111;display:none;padding:10px}
#mobile_popup_txt {position:fixed;padding:10px;top:30px;}
#mobile_popup_close_btn {position:fixed;right:10px;top:10px;}